<template>
    <view v-if="networkType == 'none'" class="error-box" @click="checkNetwork">
      <image class="disconnect-icon" src="/static/disconnection.png" mode="widthFix"></image>
      <text class="tip-text">当前网络不可用，请点击重试</text>
    </view>
</template>

<script>
	export default {
		name:"check-network",
		data() {
			return {
				networkType: ""
			};
		},
		mounted () {
		  this.checkNetwork()
		},
		methods: {
			checkNetwork() {
				uni.getNetworkType({
					success: (res) => {
						this.networkType = res.networkType
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.error-box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  align-items: center;
  justify-content: center;

  .disconnect-icon {
	will-change: transform;
    width: 200rpx;
    margin: 0 auto;
  }

  .tip-text {
    font-size: 26rpx;
    color: #333;
    margin-top: 40rpx;
  }
}
</style>